<template>
  <div>
    <div>
      <div class="top-panel">
        <div class="top-item">
          <el-input placeholder="输入医生名字查询" v-model="keyWord1"></el-input>
          <el-button type="primary" icon="el-icon-search" @click="searchDepartmentByKeyWord()">查找医生</el-button>
          <el-button @click="uploadDialog = true">批量导入</el-button>
          <el-dialog title="上传文件" :visible="uploadDialog" :before-close="closeDialog">
          <el-upload :action="action" :http-request="modeUpload">
            <el-button size="small" type="primary">点击选择文件</el-button>
          </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="imports">确认</el-button>
          <el-button @click="uploadDialog = false">取 消</el-button>
        </div>
      </el-dialog>
        </div>
        <div class="top-item" v-if="false">
          <el-dropdown trigger="click" style="cursor: pointer;" @command="handleTypeSelect">
            <span class="el-dropdown-link">
              科室类型<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item :command="item.text" v-for="(item, index) in types" :key="index">{{ item.text}}</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
        
        <div class="top-item">
          <el-button type="primary" plain @click="resetData()">重置</el-button>
        </div>
        <div class="top-item">
          <!-- <el-button type="text" @click="back()">返回</el-button> -->
        </div>
      </div>

      <el-table :data="tableData" border style="width: 100%">
        <el-table-column prop="name" label="医生姓名">
        </el-table-column>
        <el-table-column prop="sex" label="性别">
        </el-table-column>
        <el-table-column prop="dept_name" label="科室">
        </el-table-column>
        <el-table-column prop="institution_name" label="医院">
        </el-table-column>
        <el-table-column v-if="false" fixed="right" label="操作" width="100">
          <template slot-scope="scope">
            <!-- <el-button @click="handleTreatmentApply(scope.row)" type="text" size="small">查看医生</el-button> -->
            <el-button @click="handleTreatmentApply(scope.row)" type="text" size="small">修改科室信息</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="pagination-panel">
      <el-pagination @current-change="changePage" background layout="prev, pager, next" :total="total"></el-pagination>
    </div>
  </div>
</template>

<script>
import { department , organization} from '@/api';

import { deptList } from '@/utils/data/department';

export default {
  name: "Department",
  data() {
    return {
      uploadDialog: false,
      action: 'https://jsonplaceholder.typicode.com/posts/',
      file: {},
      keyWord1: null,
      tableData: null,
      types: null,
      data: {
        cur: 1,
        institute_id: 1,
        dept_id: null,
        name: null,
        // dept_name: null,
      },
      total: 0,
    }
  },
  created() {
    console.log(this.$route.query.id);
    // this.getDataList();
    this.initData();
  },
  methods: {

    initData() {
      this.data.dept_id = this.$route.query.id;
      console.log('参数：', this.data);
      department.searchInstituteUserList(this.data).then(res => {
        console.log(res);
        this.tableData = res.data.data.records;
        this.total = res.data.data.total;
      })
    },

    getDataList() {
      department.getDepartmentInfo({
        institute_id: this.id,
        cur: 1,
      }).then(res => {
        console.log(res);
        this.tableData = res.data.data;
      })
    },

    changePage(value) {
      this.data.cur = value;
      this.initData();
    },

    resetData() {
      this.initData()
    },

    back() {
      this.$router.go(-1);
    },

    searchDepartmentByKeyWord() {
      const keyWord1 = this.keyWord1;
      this.data.name = this.keyWord1;
      department.searchInstituteUserList(this.data).then(res => {
        console.log(res);
        this.tableData = res.data.data.records;
        this.total = res.data.data.total;
      })
    },

    handleTypeSelect(command) {

    },

    handleTreatmentApply() {

    },
    modeUpload(item) {
      		this.file = item.file
    	},
    imports() {
      		const file = new window.FormData()
          file.append('file', this.file)
      		organization.excelAdd(file).then(res => {
            console.log("upload file")
            console.log(res)
            this.$message({
              message:  res.data.msg,
              type: 'success'
            });
            this.closeDialog()
          })
          
    	},
      closeDialog() {
      this.uploadDialog = false;
    },

  }
}
</script>

<style></style>